草庐IT

CSS 响应中心 Div

全部标签

javascript - 在 webkit 浏览器中通过 Javascript 使用 CSS 重新绘制减速

我一直在研究使用CSS3转换或jQuery动画(当它们不可用时)的幻灯片脚本。我已经创建了一个自定义函数来制作幻灯片动画,这样做很合适。一切似乎都运行良好,但我在测试期间遇到了一个重大障碍。出于某种原因,在大型幻灯片的过渡前后应用jQueryCSS会有很大的延迟。例如,下面链接中的幻灯片大约有9900像素宽(容器宽度,其中大部分是隐藏的)。使用CSS3过渡和转换属性操纵容器以显示适当的幻灯片。在下面粘贴的第75-82行之间应用CSS时会发生延迟。特别是,应用“过渡”CSS会导致问题。将“过渡”CSS添加到样式表(而不是将其与JS一起应用),延迟就会消失。然而,这并不是真正的解决方案,因

javascript - 键盘使用后 iPad css3 动画闪烁

我正在使用HTML5/CSS3为iPad开发应用程序。我没有使用任何框架,只是使用设备本身支持的任何东西。我创建了一些css3动画来模拟典型的iOS在屏幕之间导航时向左滑动或向右滑动。这是利用iPad的CSS3硬件加速的向左滑动动画示例:(ipad运行4.2)。/*************************************************SlideLeft*************************************************/.screen.slideleft{-webkit-animation-duration:0.5s;-webki

javascript - Chrome Dev Tools 在大型网络应用程序中响应速度非常慢

我正在开发一个大型的、重javascript的网络应用程序。我的Chrome开发工具对XHR响应和控制台日志记录的响应时间非常慢(3-5秒)。实际的应用程序运行快速且响应迅速,只有开发工具看起来很痛苦。有谁知道为什么Chrome开发工具随着我的应用程序的增长而变得缓慢? 最佳答案 Devtools与任何其他调试器一样;它们Hook到应用程序的正常处理流程中,并存储比通常需要的信息多得多的信息。这比在不启用调试的情况下简单地呈现页面要多得多,因此它确实会更慢。也就是说,3秒响应console.log似乎很高。我建议您首先在nightl

javascript - 使用css3计算透视旋转的div的绝对尺寸

假设我们有一个大小为500x500px的div,考虑到webkit-perspective值为1600px,我们通过css在x轴上旋转45度。您将如何计算显示的梯形的绝对尺寸?(宽度、最大高度、Angular)我只是想出了一个计算宽度的公式,没有考虑透视,所以值有一些像素的差异(JavaScript):varabsoluteWidth=Math.cos(45*(Math.PI/180))*500);编辑:这是关于-webkit-perspective函数的规范:perspective()specifiesaperspectiveprojectionmatrix.Thismatrixma

javascript - Safari 中的 CSS 动画错误

我有一个带有延迟的CSS动画,我在延迟期间暂停了它。它在Firefox和Chrome上按预期工作,“Hello”不会移动。但是在Safari上,动画会跳到最后一帧。为什么以及如何解决?functiontest(){vartimeout=1000;setTimeout(function(){document.getElementById('animation').style.animationPlayState='paused';},timeout);}document.addEventListener("DOMContentLoaded",test);#animation{animat

c# - MVC Razor,包含来自另一个项目的 JS/CSS 文件

我有一个使用Razor语法的C#MVC项目。为了能够重用一些代码,我想将我的一些JavaScript和CSS文件放在不同的项目中,并以某种方式包含它们。这就是我的脚本目前包含的方式:目前,脚本与cshtml文件位于同一个项目中,但它们应该放在Common.Web项目中......我想要做的是这个(虽然不起作用): 最佳答案 我就是这样做的。但是,我将Javascript文件和其他内容嵌入到另一个DLL中,然后像这样从我的Razor语法中调用它们。这是我使用的代码。在View中:脚本示例:图片示例:@Html.EmbeddedImag

javascript - 如何使用 JavaScript 更改 CSS 属性

我想使用JavaScript更改类的CSS属性。我真正想要的是悬停,另一个应该变得可见。.left,.right{margin:10px;float:left;border:1pxsolidred;height:60px;width:60px}.left:hover,.right:hover{border:1pxsolidblue;}.center{float:left;height:60px;width:160px}.center.left1,.center.right1{margin:10px;float:left;border:1pxsolidgreen;height:60px;

javascript - 使用 JQuery 为 DIV 设置边距顶部

情况是这样的,我有一个高度为120px的固定header,当查询字符串为#testdiv时,我强制页面跳转到#testdiv。但问题是当页面跳转到上面DIV的开头时,部分内容会丢失,因为它在固定标题后面,有没有jquery强制页面跳转到#testdiv而不是实际边距?我尝试了下面的代码,但它产生了实际利润if(url.indexOf('#testdiv')>=0){$('#testdiv').css('margin-top',120);}; 最佳答案 我认为最简单的方法是为您的字段设置margin-top,并为您的父字段设置负的ma

javascript - 我可以在 CSS 多列布局中设置分栏符吗?

我有一大段文字流入CSS多列布局,使用CSShyphening拉伸(stretch)两列、三列或四列。.在某些时候,该栏的一个文本需要提前结束,以便让该段落的其余部分从第二栏的顶部开始。有什么方法可以让我们简单地设置一个在下一栏的顶部开始其余文本?目前我正在用大量填充该列(需要分栏符)s将HTML中的列加长以达到效果。此外,每当任何一列中的内容发生变化时,的数量都会增加。馅料不足,需要重新评估。#multicolumn{-webkit-column-count:2;/*Chrome,Safari,Opera*/-moz-column-count:2;/*Firefox*/column-

javascript - 有没有办法使用 CSS 或 javascript 从另一个 CSS 样式引用现有的 CSS 样式?

如果我定义了样式.style1{width:140px;}我可以从第二种样式中引用它吗?.style2{ref:.style1;}或者有没有办法通过javascript/jQuery?---编辑为了澄清问题,我尝试将为#x和#c定义的任何样式应用到.x和.c,而不更改CSS,因为CSS将进行我无法控制的更新。我使用了宽度,但实际上样式会更复杂一些,因为字体、边框和其他指定的样式元素。当将样式应用于类时,指定多个类名确实有效,因此我会将现有响应标记为答案,但我需要将应用于id的样式并将其应用于类样式..。如果那有意义的话。 最佳答案